<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>03_回到顶部</title>
    <style>
        #to_top {
            width: 30px;
            height: 40px;
            font: 14px/20px arial;
            text-align: center;
            background: #06c;
            position: fixed;
            cursor: pointer;
            color: #fff;
            left: 1250px;
            top: 500px;
        }
    </style>
</head>

<body style="height: 2000px;">

    <div id="to_top">返回顶部</div>

    <script src="../js/jquery-1.10.1.min.js"></script>

    <script>
        $(function() {
            //回到顶部
            $('#to_top').click(function() {
                //使用动画: 平滑滚动到顶部
                $('body,html').animate({
                    scrollTop: 0
                }, 300)
            })
        });
    </script>
</body>

</html>